/*** TABLE OF CONTENTS
======================================================
    0 / heaeder scrolling
    1 / menu toggle
    2 / call the Owl initializer functions
    3 / call the slick functions
    4 / all the  feather icons function
    5 /  call  AOS function
    6 / call  Lazy function
    7 /  call  Typed function
    8 /  call  StickySidebar function
    =================================================== ***/
$(function () {

    ("use strict");
    // ============================ 0/ heaeder scrolling
    $(window).on("scroll", function () {
        if ($(window).scrollTop() > 100) {
            $(".navbar").addClass("is-dark", 500);


        } else {
            //remove the background property so it comes transparent again (defined in your css)
            $(".navbar").removeClass("is-dark", 500);
        }
    });

    // ============================= 1/ menu toggle
    $(".menu-toggle-icon, .mobile-menu li a:not(.misterne)").on("click", function () {
        $(".mobile-menu").slideToggle();
    });
    $(document).ready(function () {

        // Check for click events on the navbar burger icon
        $(".navbar-burger").click(function () {

            // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
            $(".navbar-burger").toggleClass("is-active");
            $(".navbar-menu").toggleClass("is-active");

        });
    });
    // =========================== 2/ call the Owl initializer functions
    // $('#owl1')
    //     .owlCarousel({
    //         margin: 20,
    //         loop: true,
    //         autoWidth: false,
    //         responsiveClass: true,
    //         responsive: {
    //             0: {
    //                 items: 1,
    //             },
    //             600: {
    //                 items: 2,
    //             },
    //             1000: {
    //                 items: 3,
    //             }
    //         },
    //         autoplay: true,
    //         autoplayTimeout: 2000,
    //     });
    // $('#owl2')
    //     .owlCarousel({
    //         loop: true,
    //         autoWidth: false,
    //         responsiveClass: true,

    //         responsive: {
    //             0: {
    //                 items: 1,
    //             },
    //             600: {
    //                 items: 1,
    //             },
    //             1000: {
    //                 items: 1,
    //             }
    //         },
    //         autoplay: true,
    //         autoplayTimeout: 4000,
    //     });
    // ============================ 3/ call the slick functions


    $('.work-boxes-slick').slick({
        infinite: true,
        slidesToShow: 3,
        slidesToScroll: 1,
        dots: true,
        autoplay: true,
        autoplaySpeed: 2000,
        arrows: false,
        responsive: [{
                breakpoint: 950,
                settings: {
                    slidesToShow: 2,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
            // You can unslick at a given breakpoint now by adding:
            // settings: "unslick"
            // instead of a settings object
        ]

    });

    $('.feautures-boxes-slick').slick({
        infinite: true,
        slidesToShow: 4,
        slidesToScroll: 1,
        dots: true,
        autoplay: true,
        autoplaySpeed: 2000,
        arrows: false,
        responsive: [{
                breakpoint: 950,
                settings: {
                    slidesToShow: 2,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
            // You can unslick at a given breakpoint now by adding:
            // settings: "unslick"
            // instead of a settings object
        ]

    });
    $('.header-slick').slick({
        infinite: true,
        slidesToShow: 1,
        slidesToScroll: 1,
        dots: true,
        autoplay: true,
        autoplaySpeed: 5000,
        arrows: false,
        responsive: [{
                breakpoint: 950,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
            // You can unslick at a given breakpoint now by adding:
            // settings: "unslick"
            // instead of a settings object
        ]

    });
    $('.clients-slick').slick({
        infinite: true,
        slidesToShow: 1,
        slidesToScroll: 1,
        dots: true,
        autoplay: true,
        autoplaySpeed: 3000,
        arrows: false,
        responsive: [{
                breakpoint: 950,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            },
            {
                breakpoint: 480,
                settings: {
                    slidesToShow: 1,
                    slidesToScroll: 1
                }
            }
            // You can unslick at a given breakpoint now by adding:
            // settings: "unslick"
            // instead of a settings object
        ]

    });

    // ============================ 4/ call the  feather icons function
    feather.replace();

    // ============================  5/ call  AOS function

    AOS.init();
    AOS.init({
        offset: 10,
        once: true,
    });
    // ============================= 7/ call  Typed function



});
$(document).ready(function () {
$(".service-boxes .service-box").click(function(){
    $(".service-boxes .service-box").removeClass("is-active");
    $(this).addClass("is-active");
    $("#zashto").val($.trim($(this).attr("data-id")));
})

});